<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>音乐上传</title>
	<style>
		body {
			font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
			background-color: #f4f4f4;
			margin: 0;
			padding: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			min-height: 100vh;
		}
		.container {
			width: 400px;
			padding: 20px;
			background-color: #fff;
			border-radius: 10px;
			box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
			text-align: center;
			animation: scale 0.5s ease;
		}
		@keyframes scale {
			0% {
				transform: scale(0.8);
			}
			100% {
				transform: scale(1);
			}
		}
		h1 {
			color: #333;
			margin-bottom: 20px;
			font-size: 24px;
			text-transform: uppercase;
			letter-spacing: 2px;
			animation: color-change 5s infinite alternate;
		}
		@keyframes color-change {
			0% {
				color: #007bff;
			}
			100% {
				color: #ff0066;
			}
		}
		form {
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		label {
			color: #555;
			margin-bottom: 5px;
		}
		input[type="file"], input[type="text"], input[type="submit"] {
			padding: 10px;
			margin-bottom: 15px;
			border: 1px solid #ccc;
			border-radius: 5px;
			box-sizing: border-box;
			font-size: 16px;
			transition: border-color 0.3s;
		}
		input[type="file"]:focus, input[type="text"]:focus {
			border-color: #007bff;
		}
		input[type="submit"] {
			background-color: #007bff;
			color: #fff;
			border: none;
			cursor: pointer;
			transition: background-color 0.3s;
		}
		input[type="submit"]:hover {
			background-color: #0056b3;
		}
	</style>
</head>
<body>
<div class="container">
	<h1>音乐上传</h1>
	<form method="post" enctype="multipart/form-data" action="/music/upload">
		<label for="file"></label>
		<input type="file" name="file" id="file" accept=".mp3,.wav" required>
		<label for="singer">歌手名：</label>
		<input type="text" name="singer" id="singer" placeholder="请输入歌手名" required>
		<input type="submit" value="上传">
	</form>
</div>
</body>
</html>
